<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      .time {
        width: 400px;
        height: 100px;
        border: 1px solid #000;
        border-radius: 20%;
        margin: 50px auto;
      }
    </style>
  </head>
  <body>
    <div class="time"></div>
    <script>
      setInterval(() => {
        let time = new Date();
        let year = time.getFullYear();
        let month = time.getMonth() + 1;
        let day = time.getDate();
        let hours = time.getHours();
        let min = time.getMinutes();
        let sec = time.getSeconds();

        let obj = {
          month,
          day,
          hours,
          min,
          sec,
        };
        for (let keys in obj) {
          obj[keys] = String(obj[keys]).padStart(2, 0);
        }
        let str = `<p>今天是北京时间${year}年${obj.month}月${obj.day}日${obj.hours}时${obj.min}分${obj.sec}秒</p>`;
        let Time = document.querySelector(".time");
        Time.innerHTML = str;
      }, 1000);

      //   function NowTime() {
      //     return Object.defineProperties(
      //       {},
      //       {
      //         time: {
      //           get: function () {
      //             return new Date();
      //           },
      //           enumerable: true,
      //         },
      //         year: {
      //           get: function () {
      //             return this.time.getFullYear();
      //           },
      //           enumerable: true,
      //         },
      //         month: {
      //           get: function () {
      //             return this.time.getMonth() + 1;
      //           },
      //           enumerable: true,
      //         },
      //         day: {
      //           get: function () {
      //             return this.time.getDate();
      //           },
      //           enumerable: true,
      //         },
      //         hours: {
      //           get: function () {
      //             return this.time.getHours();
      //           },
      //           enumerable: true,
      //         },
      //         min: {
      //           get: function () {
      //             return this.time.getMinutes();
      //           },
      //           enumerable: true,
      //         },
      //         sec: {
      //           get: function () {
      //             return this.time.getSeconds();
      //           },
      //           enumerable: true,
      //         },
      //       }
      //     );
      //   }
      //   let res = NowTime();
      //   console.log(res);
      //   let { time, year, month, day, hours, min, sec } = res;

      //   for (let keys in res) {
      //     // console.log(typeof   String(res[keys]));
      //     result = String(res[keys]).padStart(2, 0);
      // ?????
      //   }

      //   let str = `<p>今天是北京时间${year}年${res.month}月${day}日${hours}时${min}分${sec}秒</p>`;
      //   let Time = document.querySelector(".time");
      //   Time.innerHTML = str;
    </script>
  </body>
</html>
